<template>
	<div class="page-wrap">
		<div class="page-content p-0">
			<div class="page-column p-0">
				<div class="page-form p-x-0">
					<el-form
						:model="ruleForm"
						:rules="rules"
						label-position="left"
						label-width="154px"
						ref="form"
						label-suffix="："
					>
						<el-row>
							<el-col :span="24">
								<el-form-item label="核素数量" prop="CHNUMWPI001">
									<select-para
										style="width:100%"
										class="mediumForm"
										v-model="ruleForm.CHNUMWPI001"
										:label.sync="ruleForm.CHNUMWPI001"
										:options="CHNUMWPI001options"
										@change="numChange"
									></select-para>
								</el-form-item>

								<el-table ref="multipleTable" :data="ruleForm.allCHLVLDE" tooltip-effect="dark" border>
									<el-table-column prop="CHWTRISO_NAM" label="饮用水途径考虑的核素名称" align="center" min-width="120">
										<template slot-scope="scope">
											<el-form-item
												label-width="0px"
												:rules="rules.CHWTRISO_NAM"
												:prop="'allCHLVLDE.'+scope.$index+'.CHWTRISO_NAM'"
											>
												<select-para
													style="width:100%"
													class="bigForm"
													v-model="scope.row.CHWTRISO_NAM"
													:label.sync="scope.row.CHWTRISO_NAM"
													:options="CHWTRISO_NAMoptions"
												></select-para>
											</el-form-item>
										</template>
									</el-table-column>
									<el-table-column prop="CHWTRISO_FRI" label="初始清洗系数" min-width="120" align="center">
										<template slot-scope="scope">
											<el-form-item
												label-width="0px"
												:rules="rules.CHWTRISO_FRI"
												:prop="'allCHLVLDE.'+scope.$index+'.CHWTRISO_FRI'"
											>
												<el-input
													oninput="value=value.replace(/^\D*(\d*(?:\.\d{0,20})?).*$/g, '$1')"
													class="bigForm"
													v-model="scope.row.CHWTRISO_FRI"
												></el-input>
											</el-form-item>
										</template>
									</el-table-column>
									<el-table-column prop="CHWTRISO_RTA" label="年清洗系数" align="center" min-width="120">
										<template slot-scope="scope">
											<el-form-item
												label-width="0px"
												:rules="rules.CHWTRISO_RTA"
												:prop="'allCHLVLDE.'+scope.$index+'.CHWTRISO_RTA'"
											>
												<el-input
													oninput="value=value.replace(/^\D*(\d*(?:\.\d{0,20})?).*$/g, '$1')"
													class="bigForm"
													v-model="scope.row.CHWTRISO_RTA"
												></el-input>
											</el-form-item>
										</template>
									</el-table-column>
									<el-table-column prop="CHWTRISO_NGF" label="饮用水食入因子" min-width="120" align="center">
										<template slot-scope="scope">
											<el-form-item
												label-width="0px"
												:rules="rules.CHWTRISO_NGF"
												:prop="'allCHLVLDE.'+scope.$index+'.CHWTRISO_NGF'"
											>
												<el-input
													oninput="value=value.replace(/^\D*(\d*(?:\.\d{0,20})?).*$/g, '$1')"
													class="bigForm"
													v-model="scope.row.CHWTRISO_NGF"
												></el-input>
											</el-form-item>
										</template>
									</el-table-column>
								</el-table>
							</el-col>
						</el-row>
					</el-form>
				</div>
				<div class="bottom-btn">
					<el-button
						type="primary"
						:disabled="this.basic_Data.OCENDAT1001=='TRUE' ||this.early_Data.MIENDAT2001=='TRUE'"
						:loading="loading"
						@click="submitFun"
					>下一步</el-button>
				</div>
			</div>
		</div>
	</div>
</template>

<script>
import selectPara from "@/components/selectPara"
import commCheckbox from "@/components/commCheckbox"
import ImageCropper from "@/components/ImageCropper"
import FixBottomButton from "@/components/FixBottomButton"
import ueditor from "@/components/ueditor"
import textLength from "@/components/common/comp/textLength"
import { commPara } from "@/mixins/mixins"
import { mapState } from "vuex"
import { dome, selecttext } from "@/utils/verify.js"
export default {
	name: "aboutUs",
	props: {
		basicDataF: Object,
	},
	mixins: [commPara],
	components: {
		selectPara,
		ImageCropper,
		textLength,
		commCheckbox,
		FixBottomButton,
		ueditor,
	},

	data() { 
		return {
			activeTab: "7", 
			ruleForm: {
				CHNUMWPI001: "1",
				CHDLBCST001: "35000.0",
				allCHLVLDE: [
					{
						CHWTRISO_NAM: "",
						CHWTRISO_FRI: "",
						CHWTRISO_RTA: "",
						CHWTRISO_NGF: "",
					},
				],
			},
			CHWTRISO_NAMoptions: [],
			rules: {
				CHNUMWPI001: [
					{
						validator: selecttext,
						trigger: ["change", "blur"],
					},
				],
				CHWTRISO_FRI: [
					{
						validator: dome(0.0, 1.0),
						trigger: ["change", "blur"],
					},
				],
				CHWTRISO_RTA: [
					{
						validator: dome(0.0, 1.0),
						trigger: ["change", "blur"],
					},
				],

				//去污工人劳动力成本
				CHWTRISO_NGF: [
					{
						validator: dome(0.0, 1.0),
						trigger: ["change", "blur"],
					},
				],
			},
			CHNUMWPI001options: [],
			loading: false,
		}
	},
	created() {
		this.setOptions()
	},
	computed: {
		...mapState({
			basic_Data: (state) => state.token.basic_Data,
			early_Data: (state) => state.token.early_Data,
			longterm_Data: (state) => state.token.longterm_Data,
		}),
	},
	mounted() {
		this.setData()
	},
	methods: {
		setData() {
			this.ruleForm.CHNUMWPI001 = this.longterm_Data.CHNUMWPI001
				? this.longterm_Data.CHNUMWPI001.toString()
				: "1"
		},
		setOptions() { 
			this.CHNUMWPI001options = []
			for (
				let index = 1;
				index <= this.basic_Data.ISOTPGRP_NAM.length;
				index++
			) {
				let templabel = {
					label: index,
					value: index,
				}
				this.CHNUMWPI001options.push(templabel)
			}

			this.CHWTRISO_NAMoptions = this.basic_Data.ISOTPGRP_NAM.map(
				(item) => {
					return {
						label: item,
						value: item,
					}
				}
			)
		},
		numChange(value) { 
			if (value) {
				this.ruleForm.allCHLVLDE = []
				for (let index = 0; index < value; index++) {
					// console.log(index)
					let tempitem = {
						CHWTRISO_NAM: this.longterm_Data.CHWTRISO_NAM[index]
							? this.longterm_Data.CHWTRISO_NAM[index].toString()
							: "",
						CHWTRISO_FRI: this.longterm_Data.CHWTRISO_FRI[index]
							? this.longterm_Data.CHWTRISO_FRI[index].toString()
							: "",
						CHWTRISO_RTA: this.longterm_Data.CHWTRISO_RTA[index]
							? this.longterm_Data.CHWTRISO_RTA[index].toString()
							: "",
						CHWTRISO_NGF: this.longterm_Data.CHWTRISO_NGF[index]
							? this.longterm_Data.CHWTRISO_NGF[index].toString()
							: "",
					}
					// console.log(tempitem)
					this.ruleForm.allCHLVLDE.push(tempitem)
				}
				// console.log(this.ruleForm.allCHLVLDE)
			}
		},
		submitFun() {
			//保存
			this.$refs.form.validate((valid) => {
				if (valid) { 
					let tempdata = JSON.parse(
						JSON.stringify(this.longterm_Data)
					) 
					tempdata.CHNUMWPI001 = parseInt(this.ruleForm.CHNUMWPI001)
					tempdata.CHWTRISO_NAM = this.ruleForm.allCHLVLDE.map(
						(item) => {
							return item.CHWTRISO_NAM
						}
					)
					tempdata.CHWTRISO_FRI = this.ruleForm.allCHLVLDE.map(
						(item) => {
							return parseFloat(item.CHWTRISO_FRI)
						}
					)
					tempdata.CHWTRISO_NGF = this.ruleForm.allCHLVLDE.map(
						(item) => {
							return parseFloat(item.CHWTRISO_NGF)
						}
					)
					tempdata.CHWTRISO_RTA = this.ruleForm.allCHLVLDE.map(
						(item) => {
							return parseFloat(item.CHWTRISO_RTA)
						}
					)
					tempdata.SETPAGEINDEX = this.activeTab
					this.$store.dispatch("upData_longterm_Data", tempdata) 
					let params = {
						batchid: this.$route.query.id,
						batchinfo: "CHANGQI",
						submitjson: JSON.stringify(tempdata),
					}
					this.$appApi
						.BATCH_SUBMIT(params)
						.then((res) => { 
							var str = res.data.substring(0, 1)
							if (str == "E") {
								let message = res.data.substring(6)
								this.$notify.error({
									title: "保存失败！",
									message: message,
									type: "success",
								})
							} else if (str == "S") {
								this.$notify({
									message: "保存成功！",
									type: "success",
								})
							}
						})
						.catch((err) => {
							console.log(err)
						})
					this.$emit("changeActiveTab", this.activeTab)
					this.$store.dispatch(
						"change_longterm_showTab",
						this.activeTab
					)
				}
			})
		},
		daochu() {
			//导出
		},
	},
}
</script>
<style lang="scss" scoped>
.page-flex-row /deep/ .el-collapse-item__header {
	background: #f3f9fe;
}
</style>